<template>
	<page-wraper :safeAreaInsetBottom="false">
		<wd-card custom-style="margin-top: 10rpx; margin-bottom: 10rpx;">
			<view>
				<div><wd-text :text="notice.title" size="22px" color="black" bold /></div>
				<div style="margin: 10px 0;"><wd-text :text="notice.created" size="14px" color="#999" /></div>
				<div class="notice-content">
					<view v-html="fixContent(notice.content)"></view>
				</div>
			</view>
		</wd-card>
	</page-wraper>
</template>

<script lang="ts" setup>
	import { ref } from 'vue'
	import { onLoad } from '@dcloudio/uni-app'

	const notice = ref<any>({})

	function fixContent(content : String) {
		return (content || '').replace(/<img/gi, '<img style="max-width:100%;height:auto;margin:0 auto;display:block"')
	}

	onLoad((query) => {
		uni.$http.get(`../../notice/get/${query.id}`).then(res => {
			if (res.data.code === 0) {
				notice.value = res.data.data
			}
		});
	})
</script>

<style lang="scss" scoped>
	:deep(.page-wraper) {
		background: #f6f6f6;
	}

	:deep(.notice-content img) {
		max-width: 100%;
	}
</style>